<html dir="ltr">
<head>
<title>Q Light Controller Plus - GUIのカスタマイズ</title>
<script src="utility.js" type="text/javascript"></script>
<link href="style.css" rel="stylesheet" type="text/css"></link>
  <meta charset="utf-8">
</head>
<BODY onLoad="replaceqrc()">


<h1>GUIのカスタマイズ</h1>

<p>QLC+4.5.0で、GUIをカスタマイズする機能が実装され、お好みの表示にカスタマイズできます。<br>
　GUIカスタマイズファイルが見つからない場合は、QLC+デフォルトのスタイルで表示されます。</p>

<h2>GUIカスタマイズファイル</h2>

<p>まず、<code>qlcplusStyle.qss</code>という名前でファイルを作成してください。<br>次に、作成したファイルを指定のフォルダに移動してください。<br>
<ul>
 <li><b>Linux</b>: $HOME/.qlcplus</li>
 <li><b>Windows</b>: Your user folder/QLC+</li>
 <li><b>OSX</b>: Library/Application Support/QLC+</li>
</ul>

　WEBと同じように、CSSと同じ構文でカスタマイズすることができます。<br>
　QLC+ではGUIをQtで実装しています。カスタマイズファイルを記述する際のセレクターはQtのリファレンスを参照してください。<br>
<a href="https://doc.qt.io/qt-5/stylesheet-syntax.html">Qt Style Sheets</a><br>
<a href="https://doc.qt.io/archives/qt-4.8/stylesheet-examples.html">Qt Style Sheets Examples</a><br>
　ユーザーが好きにGUIをカスタマイズすることができます。素晴らしいスタイルが作れたら是非<a href="https://www.qlcplus.org/forum/viewforum.php?f=5">QLC+ forum</a>でみんなと共有しましょう！！
</p>

<h2>QLC+ dark blue style example</h2>
<p>QLC+のGUIをダークテーマにカスタマイズする例をお見せしましょう。<br>
以下のコードをコピーして、<code>qlcplusStyle.qss</code>を作成し、適切なフォルダに入れるだけです。ね、簡単でしょ。</p>

<pre>
QMainWindow, QDialog
{
 background-color: #404B57;
 color: #E6E6E6;
}

QTreeWidget
{
 background-color: #3A444F;
 alternate-background-color: #404B57;
 color: #E6E6E6;
}

QTextBrowser
{
 background-color: #3A444F;
 color: #E6E6E6;
}
</pre>

</BODY>
</html>
